<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>${requestScope.animationDetailedVO.animationSimple.aname} - 花瓣动漫</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="keywords" content="${requestScope.animationDetailedVO.animationSimple.aname},动漫下载">
    <meta name="description" content="${requestScope.animationDetailedVO.animationSimple.aname}在线观看 ${requestScope.animationDetailedVO.animationSimple.aname}下载">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/static/css/common.css" media="all">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/static/css/detail.css">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/static/css/bootstrap.min.css">

    <!-- overload -->
    <style type="text/css">.anime_icon1 { margin-right: 24px; } .anime_icon1 { width: 148px; } .anime_icon1 .anime_icon1_img { width: 148px; height: 205px; }</style>

    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/getParameter.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/detail.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/utils.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/jquery.foucs.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/history.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/bootstrap.min.js"></script>
    <script>
        function getYMDHMS(time){
            var myDate = new Date(time);
            var YMD=myDate.getFullYear() + "-" + (myDate.getMonth()+1) + "-" + myDate.getDate();
            var HMS=myDate.getHours() + ":" + myDate.getMinutes() + ":" + myDate.getSeconds();
            var YMDHMS=YMD+" "+HMS;
            return  YMDHMS;

        }
    </script>
    <script>
        function load(aid,currentPage){
            //发送ajax请求，请求route/pageQuery，传递cid
            $.get("${pageContext.request.contextPath}/comments/limitComment",{"aid":aid,"currentPage":currentPage},function (data){
                $("#commentAll").html(``);
                //解析pagebean数据，展示到页面上
                //分页工具条数据展示
                //展示总页码与总记录数
                let rpb=data.data.pb;
                let userNameList=data.data.userNameList;
                let userIdList=data.data.userIdList;
                $("#totalPage").html(rpb.totalPage);
                $("#totalCount").html(rpb.totalCount);
                loadComment(rpb,userNameList,userIdList);
                //展示分页页码
                var lis="";
                var fistPage='<li onclick="javascript:load('+aid+',1)"><a href="javascript:void(0)">首页</a>&nbsp;&nbsp;</li>';
                var beforeNum=rpb.currentPage-1;
                var nextNum=rpb.currentPage+1;
                if(beforeNum<1)beforeNum=1;
                if(nextNum>rpb.totalPage)nextNum=rpb.totalPage;
                var beforePage='<li  class="threeword"><a href="javascript:void(0)" onclick="load('+aid+','+beforeNum+')">上一页</a>&nbsp;&nbsp;</li>';
                lis+=fistPage;
                lis+=beforePage;

                //展示分页前5后4
                var begin;//开始的位置
                var end;//结束的位置
                //显示10张页码
                if(rpb.totalPage<10){
                    //总页码不足10页
                    begin=1;
                    end=rpb.totalPage;
                }else{
                    //总的页码超过10页
                    begin=rpb.currentPage-5;
                    end=rpb.currentPage+4;
                    if(begin<1){
                        begin=1;
                        end=10;
                    }
                    if(end>rpb.totalPage){
                        begin=rpb.totalPage-9;
                        end=rpb.totalPage;
                    }
                }

                for(var i=begin;i<=end;i++){
                    if(i==rpb.currentPage){
                        var li='<li class="curPage" onclick="javascript:load('+aid+','+i+')"><a href="javascript:void(0)">'+i+'</a>&nbsp;&nbsp;</li>';
                    }else {
                        var li='<li onclick="javascript:load('+aid+','+i+')"><a href="javascript:void(0)">'+i+'</a>&nbsp;&nbsp;</li>';
                    }
                    //拼接字符串
                    lis+=li;
                }
                var lastPage='<li onclick="javascript:load('+aid+','+rpb.totalPage+')" class="threeword"><a href="javascript:void(0)">尾页</a>&nbsp;&nbsp;</li>';
                var nextPage='<li onclick="javascript:load('+aid+','+nextNum+')" class="threeword"><a href="javascript:void(0)">下一页</a>&nbsp;&nbsp;</li>';
                lis+=nextPage;
                lis+=lastPage;
                //将lis内容设置到<ul>
                $("#pageNum").html(lis);

                //换页定位到短评位置
                var x=$("#btncomment").offset().left;
                var y=$("#btncomment").offset().top;
                window.scrollTo(x,y);
            })
        }
        function loadComment(rpb,userNameList,userIdList){
            let commentsText='';
            for (let i=0;i<rpb.list.length;i++){
                let comments=rpb.list[i].commentsDO;
                let commentsVO=rpb.list[i];
                let userName=userNameList.list[i];
                let userId=userIdList[i];
                commentsText=commentsText+
                    '<ul id="comment_list" style="margin-top: 16px;">'+'<hr class="hrspace">'+
                    '<div class="commentcell_time asciifont">'+getYMDHMS(comments.create_time)+'</div>'+
                    '<li class="comment">'+
                    '<hr class="hrspace2">'+
                    '<a class="commentcell_user" style="font-size: 20px" onclick="updateUserName('+userId+')">'+userName+'</a>'+
                    '<div class="commentcell_content">'+
                    '<div id="comment_list">'+comments.context+'</div>'+
                    '</div>'+
                    '</li>'
                if(!commentsVO.flag){
                    commentsText=commentsText+
                    '<hr class="hrspace2">'+
                    '<div id="current_comment_page" page="">评分:'+comments.score+'</div>'+
                    '<a id="comment_like'+i+'" class="" onclick="commentLike(${sessionScope.user.uid}'+","+comments.com_id+","+comments.like_num+","+i+')">已点赞:</a>'+
                    '<span id="commentlike_num'+i+'">'+comments.like_num+'</span>'+'&nbsp;&nbsp;&nbsp;'+
                    '<a class="comment_inform" onclick="comInformBefore(${sessionScope.user.uid}'+","+comments.com_id+')" >举报</a>'+
                    '</ul>'
                }else {
                    commentsText=commentsText+
                    '<hr class="hrspace2">'+
                    '<div id="current_comment_page" page="">评分:'+comments.score+'</div>'+
                    '<a id="comment_like'+i+'" class="" onclick="commentLike(${sessionScope.user.uid}'+","+comments.com_id+","+comments.like_num+","+i+')">点赞:</a>'+
                    '<span id="commentlike_num'+i+'">'+comments.like_num+'</span>'+'&nbsp;&nbsp;&nbsp;'+
                    '<a class="comment_inform" onclick="comInformBefore(${sessionScope.user.uid}'+","+comments.com_id+')" >举报</a>'+
                    '</ul>'
                }
            }
            $("#commentAll").html(commentsText);
        }
        function loadTime(aid,currentPage){
            //发送ajax请求，请求route/pageQuery，传递cid
            $.get("${pageContext.request.contextPath}/comments/limitTimeComment",{"aid":aid,"currentPage":currentPage},function (data){
                //解析pagebean数据，展示到页面上
                //分页工具条数据展示
                //展示总页码与总记录数
                let rpb=data.data.pbTime;
                let userNameList=data.data.userNameTimeList;
                $("#totalPage").html(rpb.totalPage);
                $("#totalCount").html(rpb.totalCount);
                loadCommentTime(rpb,userNameList);
                //展示分页页码
                var lis="";
                var fistPage='<li onclick="javascript:loadTime('+aid+',1)"><a href="javascript:void(0)">首页</a>&nbsp;&nbsp;</li>';
                var beforeNum=rpb.currentPage-1;
                var nextNum=rpb.currentPage+1;
                if(beforeNum<1)beforeNum=1;
                if(nextNum>rpb.totalPage)nextNum=rpb.totalPage;
                var beforePage='<li  class="threeword"><a href="javascript:void(0)" onclick="loadTime('+aid+','+beforeNum+')">上一页</a>&nbsp;&nbsp;</li>';
                lis+=fistPage;
                lis+=beforePage;

                //展示分页前5后4
                var begin;//开始的位置
                var end;//结束的位置
                //显示10张页码
                if(rpb.totalPage<10){
                    //总页码不足10页
                    begin=1;
                    end=rpb.totalPage;
                }else{
                    //总的页码超过10页
                    begin=rpb.currentPage-5;
                    end=rpb.currentPage+4;
                    if(begin<1){
                        begin=1;
                        end=10;
                    }
                    if(end>rpb.totalPage){
                        begin=rpb.totalPage-9;
                        end=rpb.totalPage;
                    }
                }

                for(var i=begin;i<=end;i++){
                    if(i==rpb.currentPage){
                        var li='<li class="curPage" onclick="javascript:loadTime('+aid+','+i+')"><a href="javascript:void(0)">'+i+'</a>&nbsp;&nbsp;</li>';
                    }else {
                        var li='<li onclick="javascript:loadTime('+aid+','+i+')"><a href="javascript:void(0)">'+i+'</a>&nbsp;&nbsp;</li>';
                    }
                    //拼接字符串
                    lis+=li;
                }
                var lastPage='<li onclick="javascript:loadTime('+aid+','+rpb.totalPage+')" class="threeword"><a href="javascript:void(0)">尾页</a>&nbsp;&nbsp;</li>';
                var nextPage='<li onclick="javascript:loadTime('+aid+','+nextNum+')" class="threeword"><a href="javascript:void(0)">下一页</a>&nbsp;&nbsp;</li>';
                lis+=nextPage;
                lis+=lastPage;
                //将lis内容设置到<ul>
                $("#pageNum").html(lis);

                //换页定位到短评位置
                var x=$("#btncomment").offset().left;
                var y=$("#btncomment").offset().top;
                window.scrollTo(x,y);
            })
        }
        function loadCommentTime(rpb,userNameList){
            let commentsText='';
            for (let i=0;i<rpb.list.length;i++){
                let comments=rpb.list[i].commentsDO;
                let commentsVO=rpb.list[i];
                let userName=userNameList.list[i];
                commentsText=commentsText+
                    '<ul id="comment_list" style="margin-top: 16px;">'+'<hr class="hrspace">'+
                    '<div class="commentcell_time asciifont">'+getYMDHMS(comments.create_time)+'</div>'+
                    '<li class="comment">'+
                    '<hr class="hrspace2">'+
                    '<a class="commentcell_user" style="font-size: 20px" onclick="updateUserName(username)">'+userName+'</a>'+
                    '<div class="commentcell_content">'+
                    '<div id="comment_list">'+comments.context+'</div>'+
                    '</div>'+
                    '</li>'
                if(!commentsVO.flag){
                    commentsText=commentsText+
                        '<hr class="hrspace2">'+
                        '<div id="current_comment_page" page="">评分:'+comments.score+'</div>'+
                        '<a id="comment_like'+i+'" class="" onclick="commentLike(${sessionScope.user.uid}'+","+comments.com_id+","+comments.like_num+","+i+')">已点赞:</a>'+
                        '<span id="commentlike_num'+i+'">'+comments.like_num+'</span>'+'&nbsp;&nbsp;&nbsp;'+
                        '<a id="comment_inform" onclick="" >举报</a>'+
                        '</ul>'
                }else {
                    commentsText=commentsText+
                        '<hr class="hrspace2">'+
                        '<div id="current_comment_page" page="">评分:'+comments.score+'</div>'+
                        '<a id="comment_like'+i+'" class="" onclick="commentLike(${sessionScope.user.uid}'+","+comments.com_id+","+comments.like_num+","+i+')">点赞:</a>'+
                        '<span id="commentlike_num'+i+'">'+comments.like_num+'</span>'+'&nbsp;&nbsp;&nbsp;'+
                        '<a id="comment_inform" onclick="" >举报</a>'+
                        '</ul>'
                }
            }
            $("#commentAll").html(commentsText);
        }

        function commentLike(uid,com_id,like_num,i){
            var commentid="#comment_like"+i;
            var commentid_num="#commentlike_num"+i;
            //alert(commentid);
            //alert(com_id);
            $.get("${pageContext.request.contextPath}/comments/tagsComments?com_id="+com_id,{"uid":uid,"com_id":com_id,"like_num":like_num},function (data) {
                let commentFlag=data;
                //alert($("#commentlike_num").html());
                //alert(like_num);
                //alert(commentFlag);
                if(commentFlag){
                    let like_numNext=like_num+1;
                    $(commentid).html("已点赞");
                    $(commentid_num).html(like_numNext);
                }else {
                    $(commentid).html("点赞");
                    if($(commentid_num).html()==(like_num+1)) {
                        $(commentid_num).html(like_num);
                    }else $(commentid_num).html(like_num-1);
                }
            })
        }

        function updateUserName(username){
            window.location.href="${pageContext.request.contextPath}/show/getOtherMsg?username="+username;
        }

        function shutup(){
            alert("你被禁言了!请遵守社区规范");
        }

        $(document).ready(function () {
            initModal();
            $.post(
                "${pageContext.request.contextPath}/comments/showAllComments",
                {"aid":"${requestScope.animationDetailedVO.animationSimple.aid}"},
                function (data){
                    let myUserName=data.data.myUserName;
                    $("#comment_user").val(myUserName);
                    load(${requestScope.animationDetailedVO.animationSimple.aid},null);
            },"json")

            // 初始化收藏
            if (${requestScope.isCollect}) {
                $("#collect1").addClass("collect-active");
            } else {
                $("#collect1").addClass("collect");
            }
            // 收藏
            $("#collect1").click(function () {
                if ($("#collect1").hasClass("collect")) {
                    $.ajax({
                        url:"${pageContext.request.contextPath}/animation/collectAdd",
                        type:"post",
                        data:{"aid":"${requestScope.animationDetailedVO.animationSimple.aid}"},
                        dataType:"json",
                        success:function (data) {
                            if (data.flag) {
                                $("#collect1").removeClass("collect");
                                $("#collect1").addClass("collect-active");
                            } else {
                                alert("收藏失败！");
                            }
                        }
                    })
                } else {
                    $.ajax({
                        url:"${pageContext.request.contextPath}/animation/collectRemove",
                        type:"post",
                        data:{"aid":"${requestScope.animationDetailedVO.animationSimple.aid}"},
                        dataType:"json",
                        success:function (data) {
                            if (data.flag) {
                                $("#collect1").removeClass("collect-active");
                                $("#collect1").addClass("collect");
                            } else {
                                alert("取消收藏失败！");
                            }
                        }
                    })
                }
            })

            toDiscuss();
            addDiscuss();
            getReason();
        })

        function toDiscuss() {
            $("#discuss-model").click(function () {
                $(".switchbtn_current").removeClass("switchbtn_current");
                $(this).addClass("switchbtn_current");
                $("#discuss_block").removeAttr("hidden");
                $("#comments_block").attr("hidden","hidden");
                $("#recommend_block").attr("hidden","hidden");
                getAllDiscuss();
            })
        }

        function addDiscuss() {
            $("#addDiscuss").children("input").click(function () {
                addDiscussPost(getParameter("aid"), null, $("#addDiscuss").children("textarea").val());
            })
        }

        // 添加评论请求
        function addDiscussPost(aid, pre, context) {
            $.ajax({
                url:"${pageContext.request.contextPath}/discuss/addDiscuss",
                type:"post",
                data:{"aid":aid,"pre":pre,"context":context},
                dataType:"json",
                success:function (data) {
                    if (data.flag) {
                        $("#addDiscuss").children("textarea").val("");
                        getAllDiscuss();
                    } else {
                        alert("添加讨论失败");
                    }
                }
            })
        }

        // 显示评论
        function getAllDiscuss() {
            $.ajax({
                url:"${pageContext.request.contextPath}/discuss/getAllDiscuss",
                type:"post",
                data:{"aid":getParameter("aid")},
                dataType:"json",
                success:function (data) {
                    let discusses = data.data;
                    let context = ``;
                    for (let i = 0; i < discusses.length; i++) {
                        context = context + `
                            <div class="row">
                                <div class="uid" hidden>` + discusses[i].discuss.uid + `</div>
                                <div class="did" hidden>` + discusses[i].discuss.did + `</div>
                                <div class="col-md-3 uname">
                                    <a href="${pageContext.request.contextPath}/show/getOtherMsg?username=` + discusses[i].discuss.uid + `">` + discusses[i].uname + `</a>
                                </div>
                                <div class="col-md-1 col-md-offset-7">
                                    <input type="button" class="inform-btn" value="举报">
                                </div>
                                <div class="col-lg-offset-1 col-md-11">
                                    ` + discusses[i].discuss.context + `
                                </div>
                                <div class="col-md-2">
                                    <input class="getReplyBtn" type="button" value="查看回复">
                                </div>
                                <div class="col-md-offset-8 col-md-2">
                                    <input type="button" class="reply-btn" value="回复" class="reply-btn">
                                </div>
                            </div>
                        `;
                    }
                    $("#discuss").html(context);
                    getReply();
                    reply();
                    Inform();

                }
            })
        }

        // 显示回复
        function getReply() {
            $(".getReplyBtn").unbind("click");
            $(".getReplyBtn").click(function () {
                let uname = $(this).parent().parent().children(".uname").html();
                let pre = $(this).parent().parent().children(".did").html();
                let now = $(this).parent().parent();
                $(this).attr("hidden","hidden");
                $.ajax({
                    url:"${pageContext.request.contextPath}/discuss/getReply",
                    type:"post",
                    data:{"pre":pre},
                    dataType:"json",
                    success:function (data) {
                        let discusses = data.data;
                        let context = ``;
                        for (let i = 0; i < discusses.length; i++) {
                            context = context + `
                            <div class="row reply-item">
                                <div class="uid" hidden>` + discusses[i].discuss.uid + `</div>
                                <div class="did" hidden>` + discusses[i].discuss.did + `</div>
                                <div class="col-md-3 uname">
                                   <a href="${pageContext.request.contextPath}/show/getOtherMsg?username=` + discusses[i].discuss.uid + `">` + discusses[i].uname + `</a>
                                </div>
                                <div class="col-md-3">
                                    回复` + uname + `
                                </div>
                                <div class="col-md-1 col-md-offset-4">
                                    <input class="inform-btn" type="button" value="举报">
                                </div>
                                <div class="col-lg-offset-1 col-md-11">
                                    ` + discusses[i].discuss.context + `
                                </div>
                                <div class="col-md-2">
                                    <input class="getReplyBtn" type="button" value="查看回复">
                                </div>
                                <div class="col-md-offset-8 col-md-2">
                                    <input type="button" class="reply-btn" value="回复">
                                </div>
                            </div>
                        `;
                        }
                        now.after(context);
                        getReply();
                        reply();
                        Inform();
                    }
                })
            })

        }

        // 举报
        function comInformBefore(uid,com_id) {
                $.post("${pageContext.request.contextPath}/inform/findComInform",{"com_id":com_id,"uid":uid},function (data){
                    if (data.flag){
                        alert(data.errorMsg)
                    }else {
                        openDisInformModal();
                        $("#disInform").unbind("click");
                        $("#disInform").click(function () {
                            comInform(com_id,uid,$(".reasonRadio:checked").val());
                            clearDisInformModal()
                        })
                    }
                });

        }
        function comInform(com_id,uid,iid){
            $.post("${pageContext.request.contextPath}/inform/comInform",{"com_id":com_id,"uid":uid,"iid":iid},function (){
                alert("您的举报信息已经提交！")
            })
        }
        function Inform() {
            $(".inform-btn").unbind("click");
            $(".inform-btn").click(function () {
                let did = $(this).parent().parent().children(".did").html();
                let uid = $(this).parent().parent().children(".uid").html();
                $.post("${pageContext.request.contextPath}/inform/findDisInform",{"did":did,"uid":uid},function (data){
                    if (data.flag){
                        alert(data.errorMsg)
                    }else {
                        openDisInformModal();
                        $("#disInform").unbind("click");
                        $("#disInform").click(function () {
                            disInform(did,uid,$(".reasonRadio:checked").val());
                            alert(1)
                            clearDisInformModal()
                            alert(2)
                        })
                    }
                });
            });
        }
        function disInform(did,uid,iid){
            $.post("${pageContext.request.contextPath}/inform/disInform",{"did":did,"uid":uid,"iid":iid},function (){
                alert("您的举报信息已经提交！")
            })
        }


        function openDisInformModal() {
            $('.disInform-modal').css('visibility', 'visible');
            $('.disInform-modal').css('opacity', '1');
        }

        function clearDisInformModal() {
            $('.disInform-modal').css('visibility', 'hidden');
            $('.disInform-modal').css('opacity', '0');
        }

        function initDisInformModal() {
            $(".disinform-modal-close").click(function () {
                clearDisInformModal();
            })
        }
        // 回复
        function reply() {
            $(".reply-btn").unbind("click");
            $(".reply-btn").click(function () {
                if("${sessionScope.user.uid}" == $(this).parent().parent().children(".uid").html()) {
                    alert("不能回复自己的评论!")
                } else {
                    let pre = $(this).parent().parent().children(".did").html();
                    openModal();
                    $("#reply").unbind("click");
                    $("#reply").click(function () {
                        addDiscussPost(getParameter("aid"), pre, $("#reply-context").val());
                        $("#reply-context").val("");
                        clearModal();
                    })
                }
            })
        }

        function openModal() {
            $('.my-modal').css('visibility', 'visible');
            $('.my-modal').css('opacity', '1');
        }

        function clearModal() {
            $('.my-modal').css('visibility', 'hidden');
            $('.my-modal').css('opacity', '0');
        }

        function initModal() {
            $(".modal-close").click(function () {
                clearModal();
            })
        }


        function getReason() {
            $.get("${pageContext.request.contextPath}/inform/getReason",{},function (data){
                let reasonsContext=``;
                let reasonsList=data.data;
                for (let i = 0; i < reasonsList.length; i++) {
                    reasonsContext=reasonsContext+`
                    <input type="radio" class="reasonRadio" value="` + reasonsList[i].iid + `"/>
                    ` + reasonsList[i].i_context;
                }
                $("#reason").html(reasonsContext);
                initDisInformModal();
            });
        }
    </script>
    <style>
        .collect{
            margin: 0px;
            padding:10px 20px;
            border: 1px solid #000000;
            border-radius: 10px;
            font-size: 20px;
            background-color: #ffffff;
            color: #000000
        }
        .collect-active{
            margin: 0px;
            padding:10px 20px;
            border: 0px;
            border-radius: 10px;
            font-size: 20px;
            background-color: #f6491e;
            color: #FFFFFF
        }
        #discuss{
            background-color: #FFFFFF;
        }
        .reply-item {
            padding-left: 50px;
            border: 1px dotted #f5b587;
        }
        .my-modal ,.disInform-modal{
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.4);
            position: fixed;
            top: 0;
            left: 0;
            visibility: hidden;
            opacity: 0;
            z-index: 999;
            transition: all 0.3s;
            cursor: pointer;
        }
        #reply-context{
            width: 100%;
        }
    </style>
</head>

<body>
<c:import url="../user_view/component/header.jsp"></c:import>
<div class="disInform-modal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="disinform-modal-close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="disInformLabel">举报类型</h4>
                <div class="form-group" id="reason">
                </div>
            </div>
            <%--<textarea id="disInform-context"></textarea>--%>
            <div class="modal-footer">
                <button type="button" class="btn btn-default disinform-modal-close" data-dismiss="modal">关闭</button>
                <button type="button" id="disInform" class="btn btn-primary">举报</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<div class="my-modal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="modal-close close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    回复信息
                </h4>
            </div>
            <textarea id="reply-context"></textarea>
            <div class="modal-footer">
                <button type="button" class="btn btn-default modal-close" data-dismiss="modal">关闭
                </button>
                <button type="button" id="reply" class="btn btn-primary">
                    回复
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<div id="root">
    <div id="container">
        <div class="div_left">
            <div class="baseblock">
                <div class="blockcontent" style="position: relative;">
                    <img class="poster" width="256px" height="356px" src="${pageContext.request.contextPath}${requestScope.animationDetailedVO.animationSimple.cover_img}" alt="${requestScope.animationDetailedVO.animationSimple.aname}">
                </div>
            </div>
            <div class="baseblock">
                <div class="blockcontent">

                    <div class="baseblock2">
                        <div class="blocktitle detail_title1">基本信息：</div>
                        <ul class="blockcontent" >
                            <li class="detail_imform_kv">
                                <span class="detail_imform_tag">地区:</span>
                                <span class="detail_imform_value">日本</span>
                                <a class="detail_imform_show_full" href="javascript:detail_show_full();">&lt;&lt;展开</a>
                            </li>
                            <li class="detail_imform_kv">
                                <span class="detail_imform_tag">动画种类:</span>
                                <span class="detail_imform_value">TV</span></li>
                            <li class="detail_imform_kv">
                                <span class="detail_imform_tag">原版名称:</span>
                                <span class="detail_imform_value">${requestScope.animationDetailedVO.animationSimple.aname_jp}</span></li>
                            <li class="detail_imform_kv">
                                <span class="detail_imform_tag">原作:</span>
                                <span class="detail_imform_value">${requestScope.animationDetailedVO.animationSimple.author}</span></li>
                            <li class="detail_imform_kv">
                                <span class="detail_imform_tag">制作公司:</span>
                                <span class="detail_imform_value">${requestScope.animationDetailedVO.animationSimple.production_company}</span></li>
                            <li class="detail_imform_kv">
                                <span class="detail_imform_tag">首播时间:</span>
                                <span class="detail_imform_value">${requestScope.animationDetailedVO.animationSimple.create_time}</span></li>
                            <li class="detail_imform_kv">
                                <span class="detail_imform_tag">播放状态:</span>
                                <span class="detail_imform_value">${requestScope.animationDetailedVO.animationSimple.state}</span></li>
                            <li class="detail_imform_kv">
                                <span class="detail_imform_tag">剧情类型:</span>
                                <span class="detail_imform_value">${requestScope.animationDetailedVO.category.cname}</span></li>
                            <li class="detail_imform_kv">
                                <span class="detail_imform_tag">标签:</span>
                                <span class="detail_imform_value">${requestScope.animationDetailedVO.category.cname}</span></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="div_right">
            <div class="baseblock"><!--详细页作品名-->
                <div class="blockcontent">
                    <h4 class="detail_imform_name">${requestScope.animationDetailedVO.animationSimple.aname}</h4></div>
            </div>

            <div class="blockline1" style="margin: 8px;"></div>

            <div class="baseblock">
                <div class="blockcontent"><!--详细页简介-->
                    <div class="detail_imform_desc_pre">
                        <p>${requestScope.animationDetailedVO.animationDatailed.detailed}</p>
                    </div>
                </div>
            </div>

<%--            <div class="blockline1" style="margin: 8px;">--%>
                <button type="button" id="collect1">
                    <span>收藏</span>
                </button>
<%--            </div>--%>


            <div id="playlist-div" class="baseblock">
                <div class="blocktitle">在线播放：</div>
                <ul class="menu0" id="menu0">
                    <li onClick="setTab(0,0)" class="on">播放列表1</li>
                    <li onClick="setTab(0,1)" class="">播放列表2</li>
                </ul>

                <div class="main0" id="main0">
                    <div class="movurl" style="display:none">
                        <ul>
                            <li>
                                <a href="/play/20170141?playid=3_1" target="_self" title="先导PV">先导PV</a>
                            </li>

                            <li>
                                <a href="/play/20170141?playid=3_2" target="_self" title="预告">预告</a>
                            </li>

                            <li>
                                <a href="/play/20170141?playid=3_3" target="_self" title="预告2">预告2</a>
                            </li>
                        </ul>
                    </div>

                    <div class="movurl" style="display:block">
                        <ul>
                            <li>
                                <a href="/play/20170141?playid=3_1" target="_self" title="第1集">第1集</a>
                            </li>

                            <li>
                                <a href="/play/20170141?playid=3_2" target="_self" title="第2集">第2集</a>
                            </li>

                            <li>
                                <a href="/play/20170141?playid=3_3" target="_self" title="第3集">第3集</a>
                            </li>
                        </ul>
                    </div>
                </div>
                <script id="DEF_PLAYINDEX">0</script>
                <script>
                    __set_playtab_on_index(0);
                </script>
            </div>

            <div class="blockline1" style="margin: 8px;"></div>
            <!-- 广告 -->
            <script src="${pageContext.request.contextPath}/static/js/advertising.js"></script>

            <div class="blockline1" style="margin: 8px;"></div>

            <div class="baseblock">
                <div class="blockcontent">
                    <!-- switch -->
                    <div style="padding-left: 8px;">
                        <button class="switchbtn" id="btnrecommend" onclick="onbtnrecommend(this)">相关推荐</button>
                        <button class="switchbtn" id="btncomment" onclick="onbtncomment(this)">留言板</button>
                        <button class="switchbtn" id="discuss-model">讨论区</button>
                    </div>

                    <div id="recommend_block" class="switchblock">
                        <ul class="ul_li_a4">
                            <c:forEach items="${requestScope.animationMore}" var="item">
                                <c:if test="${item.aid != requestScope.animationDetailedVO.animationSimple.aid}">
                                    <li class="anime_icon1">
                                        <a href="${pageContext.request.contextPath}/animation/show_detailed?aid=${item.aid}">
                                            <img referrerpolicy="no-referrer" class="anime_icon1_img lazy" width="148" height="205" src="" data-src="${pageContext.request.contextPath}${item.cover_img}"></a>
                                        <a href="${pageContext.request.contextPath}/animation/show_detailed?aid=${item.aid}">
                                            <div class="anime_icon1_name">${item.aname}</div></a>
                                    </li>
                                </c:if>
                            </c:forEach>
                        </ul>
                    </div>

                    <div id="discuss_block" hidden>
                        <div id="discuss">
                        </div>
                        <div id="addDiscuss">
                            <textarea placeholder="说点什么" class="col-md-10"></textarea>
                            <input type="button" class="col-md-1 col-md-offset-1" value="提交">
                        </div>
                    </div>

                    <div id="comments_block" class="switchblock">
                        <form id="comment_form" action="${pageContext.request.contextPath}/comments/addComment" method="POST">

                            <div>
                                <input id="animation_id" type="hidden" name="aid" value="${requestScope.animationDetailedVO.animationSimple.aid}">
                                <input id="comment_id" type="hidden" name="uid" value="${sessionScope.user.uid}">
                                <c:if test="${sessionScope.user.banned=='N'}">
                                    <textarea id="comment_content" wrap="SOFT" spellcheck="false" autocapitalize="off" autocomplete="off" autocorrect="off" placeholder="说点什么吧" name="comment_content" tid="20180132" csrf_token="kqYFPKw9DOko88jkfLKSATbDkz6ipQBD9pYXLohUtVGXpMhQPdkP7lyYGDwiNifm"></textarea>
                                </c:if>
                                <c:if test="${sessionScope.user.banned=='Y'}">
                                    <textarea readonly="true" id="comment_content" wrap="SOFT" spellcheck="false" autocapitalize="off" autocomplete="off" autocorrect="off" placeholder="你被禁言啦!" name="comment_content" tid="20180132" csrf_token="kqYFPKw9DOko88jkfLKSATbDkz6ipQBD9pYXLohUtVGXpMhQPdkP7lyYGDwiNifm"></textarea>
                                </c:if>
                                <label class="comment_imform_tag">昵称:</label>
                                <input readonly="true" id="comment_user" class="" name="comment_user" wrap="SOFT" spellcheck="false" autocapitalize="off" autocomplete="off" autocorrect="off" placeholder="名字" value="未知用户" >
                                <label>评分:</label><input type="radio" name="score" value="1" />一星<input type="radio" name="score" value="2"/>两星<input type="radio" name="score" value="3"/>三星<input type="radio" name="score" value="4"/>四星<input type="radio" name="score" value="5" checked="checked"/>五星
                                <c:if test="${sessionScope.user.banned=='N'}">
                                    <input class="nbutton" type="submit" name="">
                                </c:if>
                                <c:if test="${sessionScope.user.banned=='Y'}">
                                    <input class="nbutton" type="button" name="" value="提交评论" onclick="shutup()">
                                </c:if>
                            </div>


                            <!-- talk_off -->
                            <a id="talk_ctrl" href="javascript:;" style="color:#E00"></a>
                            <table align="right">
                                <td>
                                    <a id="showhot" onclick="load(${requestScope.animationDetailedVO.animationSimple.aid},null)">最热&nbsp;</a>
                                </td>
                                <td>
                                    <a id="shownow" onclick="loadTime(${requestScope.animationDetailedVO.animationSimple.aid},null)">&nbsp;最新</a>
                                </td>
                            </table>
                        </form>

                        <!-- 评论列表 -->
                        <div id="commentAll"></div>

                        <!-- 评论翻页 -->
                        <hr class="hrspace">
                        <div class="pageNum">
                            <ul id="pageNum"></ul>
                        </div>
                        <div class="page_num_inf">
                            <i></i> 共 <span id="totalPage">12</span>页<span id="totalCount">132</span>条
                        </div>
                        <script>
                            var ctrl_text = ['隐藏评论>>', '开启评论>>'];
                            var talk_off = getCookie2('talk_off');
                            talk_off = (talk_off != '1' ? 0 : 1);
                            function set_talk_crtl(talk_off){
                                $('#talk_ctrl').text(ctrl_text[talk_off]);
                                if(talk_off){
                                    $('#comment_list').addClass('comment_list_off');
                                }else{
                                    $('#comment_list').removeClass('comment_list_off');
                                }
                            }
                            set_talk_crtl(talk_off);
                            $('#talk_ctrl').on('click', function(){
                                talk_off = ((talk_off+1)%2);
                                set_talk_crtl(talk_off);
                                setCookie2('talk_off', ''+talk_off);
                            });
                        </script>
                    </div>

                    <!-- 选择相关推荐还是评论 -->
                    <script type="text/javascript">var hash = window.location.hash;
                    if (hash == '#btncomment') {
                        onbtncomment();
                    } else if (hash == '#btnrecommend') {
                        onbtnrecommend();
                    } else {
                        if (Math.random() > 0.5) {
                            onbtnrecommend();
                        } else {
                            onbtncomment();
                        }
                    }</script>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>
